<template>
	<view>
		<view v-for="(item,index) in dataList" :key="item.id">
			<view class="list" @click="toDetail(item)">
				<image class="img" :src="item.cover_image" mode="aspectFill"></image>
				<!-- <u-icon name="play-circle-fill" color="#fe466b" size="50"></u-icon> -->
				<view class="right-box">
					<view class="title">{{item.title}}</view>
				</view>
				<view class="secend-line">
					<view v-if="pageType == 'lecture'" class="name">
						<image :src="item.team_info.image" class='avatar' mode="scaleToFill"></image>
						<text style="color:#fe466b;" class="u-line-1">{{item.team_info.name}}</text>
					</view>
					<u-icon class='icon' name="eye"></u-icon><text>{{item.reading_volume}}</text>
					<u-icon class='icon' name="calendar" style='margin-left: 20rpx;'></u-icon><text>{{item.createtime | date('yyyy-mm-dd')}}</text>
					<!-- <u-icon class='icon' name="clock"></u-icon><text></text> -->
				</view>

			</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	export default {
		props: {
			dataList: Array,
			pageType: String,
		},
		data() {
			return {
				baseUrl: this.$u.http.config.baseUrl
			}
		},
		methods: {
			toDetail(item) {
				
				let token = uni.getStorageSync('token')
				if (token) {
					this.$u.api.getUserInfo().then(res => {
						this.$store.commit('setUserInfo', res.data);
						uni.setStorageSync('userinfo', res.data);
					})
					let vip = uni.getStorageSync('userinfo').vip;
					
					
					if(this.pageType === 'analysis'){
						let userLevel = uni.getStorageSync('userinfo').level_list
						
						if(userLevel == 5 && vip){
							this.$u.route('/packageB/pages/hostpotDetail/hostpotDetail', {
								id: item.id,
								title: item.title,
								pageType: this.pageType
							})
						}else{
							// uni.showToast({
							// 	title: '27800会员专属解析',
							// 	duration: 1000,
							// 	icon: 'error',
							// })
							this.$refs.uToast.show({
								isTab: true,
								title: '27800会员专属解析',
								type: 'error'
							})
						}
						return false;
					}
					console.log(vip)
					if (vip || this.pageType === 'case') {
						this.$u.route('/packageB/pages/hostpotDetail/hostpotDetail', {
							id: item.id,
							title: item.title,
							pageType: this.pageType
						})
					} else {
						uni.showToast({
							title: '仅限会员观看',
							duration: 1000,
							icon: 'error',
						})
					}
				} else {
					uni.showToast({
						title: '请登录后操作',
						duration: 1000,
						icon: 'error',
					})
					setTimeout(() => {
						uni.switchTab({
							url: '/pages/my/my',
						})
					}, 1000)
				}

			}
		}
	}
</script>

<style lang="scss">
	.list {
		padding: 10rpx 20rpx;
		min-height: 180rpx;
		display: flex;
		// justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
		box-shadow: 0 0px 12px 0 rgba(0, 0, 0, 0.1);
		margin-bottom: 20rpx;
		border-radius: 20rpx;
		// position: relative;

		.img {
			width: 150rpx;
			height: 150rpx;
			border-radius: 10rpx;
			margin-top: 20rpx;
		}

		.right-box {
			height: 130rpx;

			.title {
				min-height: 50rpx;
				margin-left: 20rpx;
				font-weight: 700;
				width: 450rpx;
			}
		}

		.secend-line {
			color: #ccc;
			font-size: 25rpx;
			margin-left: 130rpx;
			margin-top: -35rpx;
			display: flex;
			align-items: center;
			// position: absolute;
			// bottom: 10rpx;
			// left: 150rpx;
			.name {
				margin-left: 40rpx;
				line-height: 50rpx;
				display: flex;
				align-items: center;
				width: 170rpx;
				.avatar{
					margin-right:10rpx ;
					width: 50rpx;
					height:50rpx;
					border-radius: 25rpx;
				}
			}

			.icon {
				margin-left: 30rpx;
				margin-right: 5rpx;
			}

		}

	}
</style>
